<template>
	<main class="page">
		<van-tabs v-model:active="active" scrollspy sticky class="van-safe-area-top" :class="showTabs?'page-tabs-show':'page-tabs-hide'" :style="themeColor" @scroll="handleTabsScroll" shrink>
			<template #nav-left>
      			<van-icon class="pre-page van-haptics-feedback" @click="goBack()" name="arrow-left"/>
			</template>
			<template #nav-right>
				<div class="nav-right">
					<van-icon class="van-haptics-feedback" name="cart-o" @click="onClickCart"/>
					<van-icon class="van-haptics-feedback" name="weapp-nav"/>
				</div>
			</template>
			<van-tab title="商品">
				<goods-images-swiper :images="gdsMainInfo.gdsPicList"/>
				<GoodsPriceBlock :min-agent-price="gdsSku.minAgentPrice" :max-agent-price="gdsSku.maxAgentPrice" :sale-amount="gdsMainInfo.saleAmount"
								 :min-guide-price="gdsSku.minGuidePrice" :max-guide-price="gdsSku.maxGuidePrice" :min-buy-count="gdsMainInfo.minBuyCount"
								 :price-ladders="gdsSku.priceLadders" :ladder-index="ladderIndex" :isPreSale="gdsMainInfo.isPreSale==='1'">
					<template #bottom>
						<GoodsActivitySheet :shopId="gdsMainInfo.shopId" :gdsId="gdsMainInfo.gdsId" :activity-list="activityList"/>
					</template>
					<van-cell :label="gdsMainInfo.titleExt">
						<template #title><div class="font-16 van-multi-ellipsis--l2">{{gdsMainInfo.gdsName}}</div></template>
					</van-cell>
					<GoodsCouponSheet :shopId="gdsMainInfo.shopId" :gdsId="gdsMainInfo.gdsId"/>
					<van-cell v-if="gdsMainInfo.autoReplaceGrant==='1'" title="本商品支持小店代发" is-link>
						<template #icon><i class="iconfont txt-primary font-18 mgr5">&#xe63b;</i></template>
						选入小店
					</van-cell>
				</GoodsPriceBlock>

				<van-cell-group inset>
					<GoodsShipCostInfo :stork-total="gdsSku.storkTotal"/>
					<GoodsServiceText/>
					<van-cell is-link icon="apps-o" :title="skuCountText" @click="handleOpenSkuSheet()">去挑选</van-cell>
					<GoodsParamsSheet :params="gdsMainInfo.params"/>
				</van-cell-group>
				<GoodsShopCard :shopId="gdsMainInfo.shopId"/>
			</van-tab>
			<van-tab title="详情">
				<van-divider>商品详情</van-divider>
				<div class="gds-detail-content">
					<div v-lazy-container="{ selector: 'img' }" v-html="gdsDesc"></div>
				</div>
				<div class="desc-price">
					<b class="txt-unicom font-14">价格说明：</b>
					<p><b>提货价 / 阶梯价 / 活动价 / 预售价：</b> 这些均为商品的当前销售价，是您最终决定是否订购商品的依据。</p>
					<p><b>划线价 / 指导价：</b> 商品展示的划横线价格为参考价，并非原价，该价格由卖家提供的正品零售价（如厂商指导价、建议零售价等）或其他真实有依据的价格；由于地区、时间的差异性和市场行情波动，可能会与您购物时展示的不一致，仅供您参考。</p>
					<p><b>定金：</b> 指卖家在进行预售活动时期，设定的预定商品定金，并非商品真正的售价；在预售期结束后，另有付尾款环节，以补全先后付款总金额达到商品的“预售价”。</p>
					<p><b>异常问题：</b> 商品促销信息以详情页中的促销相关信息为准；商品的具体售价以订单结算页价格为准；如发现活动商品售价或促销信息有异常，建议购买前先联系卖家咨询。</p>
					<div class="alert-wrap">
						<b class="font-14">内容声明</b>
						<p style="text-indent:24px;">沃易购B2b商城为第三方交易平台及互联网信息服务提供者，所展示的商品/服务的标题、价格、详情等信息内容系由店铺经营者发布，其真实性、准确性和合法性均由店铺经营者负责。本商城提醒您购买商品/服务前注意谨慎核实，如您对商品/服务的标题、价格、详情等任何信息有任何疑问的，请在购买与店铺经营者沟通确认；沃易购B2b商城存在大量店铺，如您发现店铺内有任何违法/侵权信息，请立即向本商城官方举报并提供有效线索。</p>
					</div>
				</div>
			</van-tab>
			<van-tab title="推荐">
				<GoodsYourFavorite :shopId="gdsMainInfo.shopId"/>
			</van-tab>
		</van-tabs>
		<van-divider>已经到底了</van-divider>
		<van-back-top class="base-back-top"/>
		<GoodsPackageSku ref="refPackageSku" :package="gdsPackage" :min-buy-count="gdsMainInfo.minBuyCount" @addCartClick="handleAddCart" @buyClick="handleBuy"/>
		<GoodsSku ref="refGoodsSku" :gds-sku="gdsSku" :min-buy-count="gdsMainInfo.minBuyCount" @addCartClick="handleAddCart" @buyClick="handleBuy"/>
		<GoodsSubmitBar :shopId="gdsMainInfo.shopId" :gdsId="gdsMainInfo.gdsId" @handleCart="handleOpenSkuSheet('0')" @handleBuy="handleOpenSkuSheet('1')"/>
		<van-action-sheet v-model:show="showBuySheet" :actions="actionsSheet" cancel-text="取消" description="订购方式" close-on-click-action @select="onSheetSelect" />
	</main>
</template>
<style lang="scss" scoped>
.page {
	--van-primary-color: v-bind(themeColor);
	--van-tabs-bottom-bar-color: v-bind(themeColor);
	padding-bottom:calc(50px + env(safe-area-inset-bottom));
	:deep(.van-cell__left-icon){
		font-size:18px;
	}
	:deep(.van-tabs){
		display:block;
		&>div:first-child {
			position:fixed;z-index:90;width:100%;
		}
	}
	:deep(.van-tabs__nav){
		justify-content:center;transition: all .3s ease-in-out;
	}
	:deep(.van-tab--shrink){padding:0 12px;}
	.pre-page{
		height:30px;width:30px;display:flex;border-radius:30px;align-items: center;text-indent:4px;font-size:20px;
		position:absolute;top:7px;left:10px;color:var(--van-tab-text-color);

	}
	.nav-right{
		position:absolute;top:7px;right:10px;align-items: center; justify-content: center;color:var(--van-tab-text-color);
		display:flex; padding:0 8px;border-radius:30px;
		.van-icon{
			height:30px;width:30px; align-items: center; justify-content: center;display:flex;
			font-size:20px;
			&:first-child{margin-right:8px;font-size:22px;}
		}
	}

	&-tabs-show{
		:deep(.van-tabs__wrap) {
			.van-tabs__nav{
				background-color: var(--body-bg-color);
			}
		}
	}
	&-tabs-hide{
		:deep(.van-tabs__wrap) {
			.van-tabs__nav {
				background-color: transparent;
				.van-tabs__line { visibility: hidden; }
				.van-tab {
					background-color: rgba(0, 0, 0, .3);color:var(--white-color);
					margin: 7px 0;
					&:not(:first-of-type)::before {
						position: absolute; width: 1px; height: 14px; left: -0.5px; background-color: #fff; content: ' '; display: block
					}
					&:nth-last-child(3) { border-top-right-radius: 30px; border-bottom-right-radius: 30px; }
					&:nth-child(2) { border-top-left-radius: 30px; border-bottom-left-radius: 30px; }
				}
				.pre-page,.nav-right{
					background-color: rgba(0, 0, 0, .3);color:var(--white-color);
				}
			}
		}
	}
	.gds-detail-content{
		background:var(--white-color);overflow:hidden;
		:deep(img) {
			vertical-align: middle !important;
			width: 100% !important;
			height: auto!important;
		}
	}
	.desc-price{
		color:var(--font-second-color);padding:14px;font-size:12px; background:var(--white-color);
		p{margin:4px 0;line-height:1.4;}
		.alert-wrap{
			margin:14px 0 0; overflow: hidden; border-radius: 8px; color:var(--nav-bg-color);
			padding:10px; background:var(--bar-input-color);
		}
	}
}

</style>
<script lang="ts" setup>
import {GdsPackage, GdsPackageGroupItem, GoodsBaseItem, GoodsActivity} from '@/types'
import { showToast } from 'vant';
import {getCkeditValue} from "@/utils/validate"
import _ from 'lodash'

//data
const router = useRouter()
const gdsId = router.currentRoute.value.query['gdsId'] as string
console.log('gdsId='+gdsId)
const active = ref(0) //滚动导航的位置
const showTabs = ref(false) //是否显性化滚动导航栏
const themeColor =ref('#7232dd') //todo: 主题色,从环境变量中取默认值，后续从店铺信息中取自定义值
const gdsPackage=reactive<GdsPackage>({
	packageId:'', packageName:'', packageDesc:'', groupList:[]
}) //当前商品包上拉框中展示的数据

const sheetType=ref<string|undefined>()
//商品基本主要信息，todo:未来要改成从服务端异步读取主要数据
const gdsMainInfo=reactive<GoodsBaseItem>({
	gdsId:'12345',
	gdsName:'VIVO 耳机蓝牙耳机 VIVO无线运动耳机2 （原封正品/官方售后）(配件)',
	titleExt:'无线运动耳机2 11.2mm大动圈丨12小时长续航丨舒适稳固佩戴 | 内含Type-C数据线1条 颈挂式磁吸防水跑步 全国联保',
	//商品参数列表， todo:要改成异步从服务端读取基本时，顺带读取，
	params:[
		{"value":"5G全网通","name":"网络类型"},
		{"value":"vivo","name":"品牌"},
		{"value":"Y78","name":"型号"},
		{"value":"全国联保","name":"售后服务"},
		{"value":"Type-C","name":"接口类型"},
		{"value":"2388×1080","name":"分辨率"},
		{"value":"5.3","name":"蓝牙版本"},
		{"value":"八核","name":"CPU核心数"},
		{"value":"凤羽金 玉瓷青 皓夜黑", "name":"机身颜色"},
		{"value":"官方标配","name":"套餐类型"},
		{"value":"5000万+200万","name":"后置摄像头"},
		{"value":"维沃移动通信有限公司","name":"生产企业"},
		{"value":"8GB+128GB 8GB+256GB 12GB+256GB","name":"存储容量"},
		{"value":"LCD","name":"屏幕材质"},
		{"value":"f/1.8","name":"最大光圈"},
		{"value":"5G智能手机","name":"手机类型"},
		{"value":"三摄像头（前一后二）","name":"摄像头类型"},
		{"value":"双卡双待","name":"网络模式"},
		{"value":"00-B220-238331","name":"电信设备进网许可证编号"},
		{"value":"120Hz","name":"屏幕刷新率"},
		{"value":"中国大陆","name":"版本类型"},
		{"value":"Android/安卓","name":"操作系统"},
		{"value":"3.5mm","name":"耳机插头类型"},
		{"value":"全面屏","name":"屏幕类型"},
		{"value":"直板","name":"款式"},
		{"value":"联发科","name":"CPU品牌"},
		{"value":"2023-05","name":"上市时间"},
		{"value":"6.64英寸","name":"屏幕尺寸"},
		{"value":"5000mAh","name":"电池容量"},
		{"value":"高通骁龙™ 782G","name":"CPU型号"},
		{"value":"侧边指纹","name":"解锁方式"},
		{"value":"复合板材","name":"后壳材质"},
		{"value":"否","name":"是否支持无线充电"},
		{"value":"否","name":"是否支持NFC"},
		{"value":"44W","name":"充电功率"},
		{"value":"12个月","name":"保修期"},
		{"value":"800万像素","name":"前置摄像头像素"},
		{"value":"Y78系列","name":"商品系列"},
		{"value":"2023011606537156","name":"3C证书编号"}
	],
	gdsPicList:[//商品图片列表 todo: 仅示例，后期要异步读取
		'https://cbu01.alicdn.com/img/ibank/O1CN01UPP9V91GurHVbEI0t_!!989100683-0-cib.jpg',
		'https://cbu01.alicdn.com/img/ibank/O1CN01SabTvk28EFglRqIZ4_!!2214324377900-0-cib.jpg',
		'https://cbu01.alicdn.com/img/ibank/O1CN01tEPxaI28EFgsMjuik_!!2214324377900-0-cib.jpg',
		'https://cbu01.alicdn.com/img/ibank/O1CN01dNFPi928EFglRsZvs_!!2214324377900-0-cib.jpg',
		'https://cbu01.alicdn.com/img/ibank/O1CN01qmAaJm28EFglRq662_!!2214324377900-0-cib.jpg',
		'https://cbu01.alicdn.com/img/ibank/O1CN01Kld1Mr28EFgqoTewQ_!!2214324377900-0-cib.jpg',
		'https://cbu01.alicdn.com/img/ibank/O1CN01sJjSmU1peq4euRtOf_!!2211843005386-0-cib.jpg',
		'https://cbu01.alicdn.com/img/ibank/O1CN019LECAY1peq1NqacLL_!!2211843005386-0-cib.jpg',
		'https://cbu01.alicdn.com/img/ibank/O1CN01hWdssO1GurHXfdxyX_!!989100683-0-cib.jpg',
	],
	saleAmount:63522,//近三个月销量
	isLadder: '0',//是否使用了阶梯价定义 1是，0否
	isPreSale: '0',//是否是预售商品 1是，0否
	isDerate: '1', //是否减免运费,1:减免 0:不减免
	isTicket: '1', //是否开票，1:是 0:否
	insured: '1', //是否有价保 1：有价保  0：无价保
	ifBargainPay: '0', //是否支持定金支付 0:不支持 1：支持定金支付
	autoReplaceGrant: '1', //是否支持优品小店设置，0/空=否、1=是
	businessModel: '0', //业务模式 0原来模式 1一件代发 2厂家直发
	iosSellFlag: '0', //苹果售点标识:1-是，0-否
	minBuyCount: 1,//最小起订量，默认为1
	limitedBuNum: 0,//最多限购几台？0表示不限制
	gdsDesc: '60d69bf6b0d37bc214f57156',//获取商品详细介绍用的长串id编码
	shopId:'ZBCU4321',//归属的店铺id,
})
const showBuySheet=ref(false) //当商品含有套包时才用到；选择购买单独商品/某个套包组合时，上拉框供客户选择\
//是否允许该商品单独购买？默认可以，但实际值要在遍历可能的套包设定后才能用到
const ifSeparately =ref('1')
const actionsSheet=ref([
	{ name: '套包1-名称1', packageId:'11' },
	{ name: '套包2-名称2', packageId:'22' },
])

//单品其及属性定义的结构体，服务端返回的接口标准 todo:未来要改成从服务端异步读取主要数据
const gdsSku=reactive({
	sbShopStatus: '1',  //店铺壮态，是否还有效存续
	gdsStatus: '1',    //商品状态，是否还有效且为上架状态
	storkTotal:10000, //所有单品总库存，为0时表示“区域无货”
	minGuidePrice:260000, //最小的指导价
	maxGuidePrice:350000, //最大的指导价
	minAgentPrice:149900, //最小的提货价
	maxAgentPrice:299900, //最大的提货价
	//autoReplaceGrant: 1,
	skus: [
		{
			gdsId: '53214123', skuId: '106883920', skuPrice: 149900,
			stockAmount: 192,
			params: [
				{ propId: '12000', propValue: '颜色', vId: '106502497', vName: '星空蓝' },
				{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
				{ propId: '12002', propValue: '机身内存', vId: '10671', vName: '8+128G' },
			]
		},
		{
			gdsId: '53214123', skuId: '106883921', skuPrice: 189900,
			stockAmount: 192,
			params: [
				{ propId: '12000', propValue: '颜色', vId: '106502497', vName: '星空蓝' },
				{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
				{ propId: '12002', propValue: '机身内存', vId: '10672', vName: '8+256G' },
			]
		},
		{
			gdsId: '53214123', skuId: '106883922', skuPrice: 229900,
			stockAmount: 192,
			params: [
				{ propId: '12000', propValue: '颜色', vId: '106502497', vName: '星空蓝' },
				{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
				{ propId: '12002', propValue: '机身内存', vId: '10673', vName: '12+256G' },
			]
		},
		{
			gdsId: '53214123', skuId: '106883923', skuPrice: 259900,
			stockAmount: 0,
			params: [
				{ propId: '12000', propValue: '颜色', vId: '106502497', vName: '星空蓝' },
				{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
				{ propId: '12002', propValue: '机身内存', vId: '10674', vName: '12+512G' },
			]
		},
		{
			gdsId: '53214123', skuId: '106883924', skuPrice: 149900,
			stockAmount: 200,
			params: [
				{ propId: '12000', propValue: '颜色', vId: '106502498', vName: '椰奶白' },
				{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
				{ propId: '12002', propValue: '机身内存', vId: '10671', vName: '8+128G' },
			]
		},
		{
			gdsId: '53214123', skuId: '106883925', skuPrice: 189900,
			stockAmount: 200,
			params: [
				{ propId: '12000', propValue: '颜色', vId: '106502498', vName: '椰奶白' },
				{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
				{ propId: '12002', propValue: '机身内存', vId: '10672', vName: '8+256G' },
			]
		},
		{
			gdsId: '53214123', skuId: '106883926', skuPrice: 229900,
			stockAmount: 0,
			params: [
				{ propId: '12000', propValue: '颜色', vId: '106502498', vName: '椰奶白' },
				{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
				{ propId: '12002', propValue: '机身内存', vId: '10673', vName: '12+256G' },
			]
		},
		{
			gdsId: '53214123', skuId: '106883927', skuPrice: 259900,
			stockAmount: 200,
			params: [
				{ propId: '12000', propValue: '颜色', vId: '106502498', vName: '椰奶白' },
				{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
				{ propId: '12002', propValue: '机身内存', vId: '10674', vName: '12+512G' },
			]
		},
		{
			gdsId: '53214123', skuId: '106883916', skuPrice: 149900,
			stockAmount: 300,
			params: [
				{ propId: '12000', propValue: '颜色', vId: '106502496', vName: '雅粉色' },
				{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
				{ propId: '12002', propValue: '机身内存', vId: '10671', vName: '8+128G' },
			]
		},
		{
			gdsId: '53214123', skuId: '106883910', skuPrice: 189900,
			stockAmount: 0,
			params: [
				{ propId: '12000', propValue: '颜色', vId: '106502496', vName: '雅粉色' },
				{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
				{ propId: '12002', propValue: '机身内存', vId: '10672', vName: '8+256G' },
			]
		},
		{
			gdsId: '53214123', skuId: '106883911', skuPrice: 229900,
			stockAmount: 300,
			params: [
				{ propId: '12000', propValue: '颜色', vId: '106502496', vName: '雅粉色' },
				{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
				{ propId: '12002', propValue: '机身内存', vId: '10673', vName: '12+256G' },
			]
		},
		{
			gdsId: '53214123', skuId: '106883912', skuPrice: 259900,
			stockAmount: 300,
			params: [
				{ propId: '12000', propValue: '颜色', vId: '106502496', vName: '雅粉色' },
				{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
				{ propId: '12002', propValue: '机身内存', vId: '10674', vName: '12+512G' },
			]
		},
		{
			gdsId: '53214123', skuId: '106883913', skuPrice: 299900,
			stockAmount: 300,
			params: [
				{ propId: '12000', propValue: '颜色', vId: '106502496', vName: '雅粉色' },
				{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
				{ propId: '12002', propValue: '机身内存', vId: '10674', vName: '16+1T' },
			]
		},
	],
	props: [
		{
			propId: '12000', propValue: '颜色',
			params: [
				{ vId: '106502496', vName: '雅粉色', vImg: 'https://www.woego.cn/woego/image/5f9a86ae75b0bd759426efa1.jpg' },
				{ vId: '106502497', vName: '星空蓝', vImg: 'https://www.woego.cn/woego/image/5f9280e27f93cd65103cffba.jpg' },
				{ vId: '106502498', vName: '椰奶白', vImg: 'https://www.woego.cn/woego/image/5f9a86a7746132aa567bc3e2.jpg' },
				// { vId: '106502496', vName: '雅粉色',},
				// { vId: '106502497', vName: '星空蓝',},
				// { vId: '106502498', vName: '椰奶白',},
			]
		},
		{
			propId: '12001', propValue: '网络支持',
			params: [
				{ vId: '10661', vName: '5G', },
			]
		},
		{
			propId: '12002', propValue: '机身内存',
			params: [
				{ vId: '10671', vName: '8+128G', },
				{ vId: '10672', vName: '8+256G', },
				{ vId: '10673', vName: '12+256G', },
				{ vId: '10674', vName: '12+512G', },
				{ vId: '10675', vName: '16+1T', },
			]
		}
	],
	priceLadders:[ //阶梯价设定，严格按购买量从少到多顺序排列，如果无则返回空数组
		{ buyMinAmount: 1, buyMaxAmount: 99, afterAmountPrice: 230000, },
		{ buyMinAmount: 100, buyMaxAmount: 299, afterAmountPrice: 220000, },
		{ buyMinAmount: 300, buyMaxAmount: 1999, afterAmountPrice: 210000, },
		{ buyMinAmount: 2000, buyMaxAmount: 0, afterAmountPrice: 200000, },
	],
})

const gdsPackageList=ref<GdsPackage[]>([
	{
		packageId:'11', //套包ID
		packageName: '1个主商品+2个套包商品1+1个套包商品2', //套包名称
		packageDesc: '每当订购1个主商品时，都必须要搭配选择2个套包商品1，和1个套包商品2，万不支持单独购买哦~', //套包描述
		groupList:[
			{   //第一个，就默认是主商品所在的分组了，必须包含一个gdsId=当前商品详情页的商品gdsId!
				gdsList:[
					{
						gdsId:'53214123',ifSeparately:'1', gdsName:'VIVO 耳机蓝牙耳机 VIVO无线运动耳机2 （原封正品/官方售后）(配件)',
						minPrice:149900,maxPrice:229900,
						skus: [
							{
								gdsId: '53214123', skuId: '106883922', skuPrice: 229900, stockAmount: 192,
								skuImg:'https://www.woego.cn/woego/image/5f9a86ae75b0bd759426efa1.jpg', //与sku不同，商品套包在返回前台，每个SKU就要定好可能的sku图片
								params: [
									{ propId: '12000', propValue: '颜色', vId: '106502497', vName: '星空蓝' },
									{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
									{ propId: '12002', propValue: '机身内存', vId: '10673', vName: '12+256G' },
								]
							},
							{
								gdsId: '53214123', skuId: '106883924', skuPrice: 149900, stockAmount: 200,
								skuImg:'https://www.woego.cn/woego/image/5f9280e27f93cd65103cffba.jpg',
								params: [
									{ propId: '12000', propValue: '颜色', vId: '106502498', vName: '椰奶白' },
									{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
									{ propId: '12002', propValue: '机身内存', vId: '10671', vName: '8+128G' },
								]
							},
							{
								gdsId: '53214123', skuId: '106883916', skuPrice: 149900, stockAmount: 300,
								skuImg:'https://www.woego.cn/woego/image/5f9a86a7746132aa567bc3e2.jpg',
								params: [
									{ propId: '12000', propValue: '颜色', vId: '106502496', vName: '雅粉色' },
									{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
									{ propId: '12002', propValue: '机身内存', vId: '10671', vName: '8+128G' },
								]
							},
						],
					}
				],
				ratio:2, reduceNum:0,
			},
			{   //第一个以后，就混搭的待选商品了
				gdsList:[
					{
						gdsId:'106841422',ifSeparately:'2', gdsName:'VIVO 无线充电套套壳(配件)',
						minPrice:149900,maxPrice:229900,
						skus: [
							{
								gdsId: '106841422', skuId: '1068414221', skuPrice: 229900, stockAmount: 92,
								skuImg:'https://cbu01.alicdn.com/img/ibank/O1CN01VXn2KD1OOM2bybGvZ_!!2207926941695-0-cib.jpg',
								params: [
									{ propId: '12000', propValue: '颜色', vId: '106502497', vName: '星空蓝' },
									{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
									{ propId: '12002', propValue: '机身内存', vId: '10673', vName: '12+256G' },
								]
							},
							{
								gdsId: '106841422', skuId: '1068414222', skuPrice: 149900, stockAmount: 20,
								skuImg:'https://cbu01.alicdn.com/img/ibank/O1CN01AOR1pw1OOM3KNJjaE_!!2207926941695-0-cib.jpg',
								params: [
									{ propId: '12000', propValue: '颜色', vId: '106502498', vName: '椰奶白' },
									{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
									{ propId: '12002', propValue: '机身内存', vId: '10671', vName: '8+128G' },
								]
							},
						],
					},
					{
						gdsId:'106841421',ifSeparately:'2', gdsName:'OPPO X多彩panda风格套',
						minPrice:149900,maxPrice:229900,
						skus: [
							{
								gdsId: '106841421', skuId: '1068414211', skuPrice: 229900, stockAmount: 192,
								skuImg:'https://cbu01.alicdn.com/img/ibank/O1CN01VXn2KD1OOM2bybGvZ_!!2207926941695-0-cib.jpg',
								params: [
									{ propId: '12000', propValue: '颜色', vId: '106502497', vName: '星空蓝' },
									{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
									{ propId: '12002', propValue: '机身内存', vId: '10673', vName: '12+256G' },
								]
							},
							{
								gdsId: '106841421', skuId: '1068414212', skuPrice: 149900, stockAmount: 200,
								skuImg:'https://cbu01.alicdn.com/img/ibank/O1CN01AOR1pw1OOM3KNJjaE_!!2207926941695-0-cib.jpg',
								params: [
									{ propId: '12000', propValue: '颜色', vId: '106502498', vName: '椰奶白' },
									{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
									{ propId: '12002', propValue: '机身内存', vId: '10671', vName: '8+128G' },
								]
							},
						],
					}
				],
				ratio:3, reduceNum:0,
			},
			{   //第一个以后，就混搭的待选商品了
				gdsList:[
					{
						gdsId:'106841433',ifSeparately:'2', gdsName:'VIVO typec快充头60W',
						minPrice:149900,maxPrice:229900,
						skus: [
							{
								gdsId: '106841433', skuId: '1068414331', skuPrice: 229900, stockAmount: 192,
								params: [
									{ propId: '12000', propValue: '颜色', vId: '106502497', vName: '星空蓝' },
									{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
									{ propId: '12002', propValue: '机身内存', vId: '10673', vName: '12+256G' },
								]
							},
							{
								gdsId: '106841433', skuId: '1068414332', skuPrice: 149900, stockAmount: 200,
								params: [
									{ propId: '12000', propValue: '颜色', vId: '106502498', vName: '椰奶白' },
									{ propId: '12001', propValue: '网络支持', vId: '10661', vName: '5G' },
									{ propId: '12002', propValue: '机身内存', vId: '10671', vName: '8+128G' },
								]
							},
						],
					}
				],
				ratio:4, reduceNum:0,
			}
		]
	},
	{
		packageId:'22', //套包ID
		packageName: '1个主商品+3个套包商品1', //套包名称
		packageDesc: '这是一个仅测试用的空套包！', //套包描述
		groupList:[

		]
	}
])

//当前支持活动列表 todo: 后期改成从服务端读取，要求后台按当前有效性、是否能作用到售价、活动开始时间降序的 order by方式返回，
const activityList=ref<Array<GoodsActivity>>([
	{
		activityId:'22',
		activityTheme:'国庆满2999减200',
		typeCategory:'01', //活动分类：01单品优惠 02订单优惠 03外围优惠
		typeCode:'01',
		typeName:'直降',
		activityContent:'国庆满299减20国庆满299减20国庆满299减20国庆满299减20国庆满299减20',
		endDate:'2023-12-31',
		activityPrice:3000,
		SurplusStock:100,
		activityMinAmount:2,
		canBuy:true,
	},
	{
		activityId:'11',
		activityTheme:'中秋满299减20',
		typeCategory:'02', //活动分类：01单品优惠 02订单优惠 03外围优惠
		typeCode:'02',
		typeName:'满减优惠',
		activityContent:'国庆满299减20国庆满299减20国庆满299减20国庆满299减20国庆满299减20',
		endDate:'2023-12-31',
	},
	{
		activityId:'44',
		activityTheme:'手机新品大酬宾',
		typeCategory:'01', //活动分类：01单品优惠 02订单优惠 03外围优惠
		typeCode:'04',
		typeName:'限时抢购',
		activityContent:'国庆满299减20国庆满299减20国庆满299减20国庆满299减20国庆满299减20',
		endDate:'2023-12-31',
		activityPrice:3000,
		SurplusStock:100,
		activityMinAmount:2,
		canBuy:true,
	},
	{
		activityId:'55',
		activityTheme:'手机节赠品',
		typeCategory:'03', //活动分类：01单品优惠 02订单优惠 03外围优惠
		typeCode:'03',
		typeName:'造星计划',
		activityContent:'手机节赠品手机节赠品手机节赠品手机节赠品手机节赠品手机节赠品手机节赠品手机节赠品手机节赠品',
		endDate:'2023-12-31',
	},
	{
		activityId:'66',
		activityTheme:'618限时抢购大狂欢',
		typeCategory:'03', //活动分类：01单品优惠 02订单优惠 03外围优惠
		typeCode:'06',
		typeName:'买赠',
		activityContent:'国庆满299减20国庆满299减20国庆满299减20国庆满299减20国庆满299减20',
		endDate:'2023-12-31',
	},
])


//单品sku、购买、加购物车功能相关
//SKU组件实例
const refGoodsSku=ref()
//商品套包组合、购买、加购物车功能相关
const refPackageSku=ref()

//computed
const selectedCount=computed(()=>{
	if(refGoodsSku.value==null)	return true
	return refGoodsSku.value.totalCount
})
const selectedPrice=computed(()=>{
	if(refGoodsSku.value==null)	return true
	return refGoodsSku.value.totalPrice
})
const ladderIndex=computed(()=>{
	if(refGoodsSku.value==null)	return 0
	return refGoodsSku.value.ladderMeetIndex
})
const skuCountText=computed(()=>{
	if(gdsSku.skus.length>0)
		return '共'+gdsSku.skus.length+'种单品可选'
	else
		return '单品/分类/配置'
})



//富文本内容
const gdsDesc = ref('')
//读取富文本内容
const loadRichHtml=()=>{
	getCkeditValue('https://www.woego.cn/woego/static/html/'+gdsMainInfo.gdsDesc+'.html', (err:any, data:any) => {
		if (err) {
			console.error(err.message);
		} else {
			if (data.result) {
				gdsDesc.value = data.result.replace(/ src=/g, ' data-src=')  //为了懒加载图片而做特殊处理
			}
		}
	})
}

//method
const {to,goBack} =useGoto()

const onClickCart = () => {
	router.push('/cart2');
};

const handleTabsScroll=(e:any)=>{
	if (e.scrollTop > 280) {
		showTabs.value = true;
	} else {
		showTabs.value = false;
	}
}

//打开SKU上拉框或者某套包组合的上拉框
const handleOpenSkuSheet=(type?:string)=>{
	sheetType.value=type||undefined
	if(refPackageSku.value) {
		showBuySheet.value=true
	}else if(refGoodsSku.value){
		refGoodsSku.value.displaySkuSheet(type)
	}
}
//点击上拉“订购方式”选项时，确定打开SKU上拉还是套包组合上拉
const onSheetSelect =(item:any)=>{
	if(_.isEmpty(item.packageId)){
		refGoodsSku.value.displaySkuSheet(sheetType.value)
	}else{
		for(const pack of gdsPackageList.value){
			if(pack.packageId === item.packageId){
				//gdsPackage = Object.assign({},pack)
				gdsPackage.packageId = pack.packageId
				gdsPackage.packageName = pack.packageName
				gdsPackage.packageDesc = pack.packageDesc
				if(gdsPackage.groupList.length>0){
					gdsPackage.groupList.splice(0,gdsPackage.groupList.length)
				}
				for(let group of pack.groupList){
					gdsPackage.groupList.push(group);
				}
				refPackageSku.value.reloadGroup()
				refPackageSku.value.displaySkuSheet(sheetType.value)
				break;
			}
		}
	}
}
//加采购车事件响应： todo: 仅示例，要改造成异步api请求响应
const handleAddCart=(skuSelected:any)=>{
	if(!refGoodsSku.value)	return
	showToast('加采购车成功')
	console.log('加采购车',skuSelected)
}
//立即订购事件响应： todo: 仅示例，要改造成异步api请求响应
const handleBuy=(skuSelected:any)=>{
	if(!refGoodsSku.value)	return
	console.log('立即订购',skuSelected)
}

//遍历套包列表，确定当前商品是否可以单独购买
const checkIfSeparately =(gdsId:string,packList: GdsPackage[])=>{
	for(let pack of packList){
		for(let group of pack.groupList){
			for(let gds of group.gdsList){
				if(gdsId===gds.gdsId&&gds.ifSeparately==='2')	return false
			}
		}
	}
	return true
}

onMounted(()=>{
	if(checkIfSeparately(gdsId,gdsPackageList.value)){  //从商品套包中检查本商品能否单独购买，再决定是否要读取sku详情
														// todo:这里仅是测试，实际上现实要移到套包读取完毕后的事件中
		actionsSheet.value.push({ name: '仅订购本商品', packageId:'' })  //如果不能单独购买，则不能使用GoodsSku
	}
	loadRichHtml() //todo: 这里仅是测试，实际上是要在商品基本信息获取完毕后，且mounted后执行该方法
})
</script>